<template>
    <div class="limiter">
        <div class="container-login100" style="background-image: url('/assets/images/img-01.jpg');">
            <div class="wrap-login100 p-t-190 p-b-30">
                <van-form @submit="onLogin" class="login100-form validate-form">
                    <div class="login100-form-avatar">
                        <img src="/assets/images/avatar-01.jpg" alt="AVATAR">
                    </div>

                    <span class="login100-form-title p-t-20 p-b-45">Hello</span>

                    <div class="wrap-input100 validate-input m-b-10" data-validate="请输入手机号">
                        <input class="input100" required v-model="LoginAuth.mobile" type="text" name="mobile"
                            placeholder="手机号" autocomplete="off">
                        <span class="focus-input100"></span>
                        <span class="symbol-input100">
                            <i class="fa fa-user"></i>
                        </span>
                    </div>

                    <div class="wrap-input100 validate-input m-b-10" data-validate="请输入密码">
                        <input class="input100" required v-model="LoginAuth.password" type="password" name="password"
                            placeholder="密码">
                        <span class="focus-input100"></span>
                        <span class="symbol-input100">
                            <i class="fa fa-lock"></i>
                        </span>
                    </div>

                    <div class="container-login100-form-btn p-t-10 p-b-30">
                        <button class="login100-form-btn">登 录</button>
                    </div>

                    <div class="text-center w-full">
                        <router-link class="txt1" to="/business/base/register">
                            立即注册
                            <i class="fa fa-long-arrow-right"></i>
                        </router-link>
                    </div>
                </van-form>
            </div>
        </div>
    </div>
</template>

<script setup>
import { reactive } from 'vue'
import { showNotify, showToast } from 'vant'
import ApiList from '@/api'
import { useRouter,useRoute } from 'vue-router';
import { useUserStore } from '@/store/user.js'
import resJudge from '@/hooks/res.js'

const router = useRouter()
const route = useRoute()
const userStore = useUserStore()

let LoginAuth = reactive({
    mobile: '13423562356',
    password: '123456',
})
//登录提交
async function onLogin() {
    let Reg = /(^1[3|4|5|7|8][0-9]{9}$)/

    if (!Reg.test(LoginAuth.mobile)) {
        showNotify({
            type: 'warning',
            message: '手机号格式错误'
        })
        return false
    }

    let res = await ApiList.login(LoginAuth)

    if (resJudge(res)) {
        //pinia持久化存储
        userStore.$patch(state => {
            state.userInfo = res.data
        })
        if (route.query.action === 'info') {
            router.go(-1)
        } else {
            router.push('/business/base/index')
        }
    }
    // if (res.code == 1) {
    //     showToast({
    //         message: '登录成功',
    //         position: 'bottom',
    //     });
    //     // //pinia持久化存储
    //     // userStore.$patch(state=>{
    //     //     state.userInfo = res.data
    //     // })
    //     router.push('/business/base/index')
    // }else{
    //     showToast({
    //         message: res.msg,
    //         position: 'bottom',
    //     });
    // }
}
</script>

<style>
@import url('/assets/fonts/font-awesome-4.7.0/css/font-awesome.min.css');
@import url('/assets/css/util.css');
@import url('/assets/css/main.css');
</style>